<!DOCTYPE html>
<html>
<head>
  <title>Vector Layer (JDBC)</title>
  <link rel="stylesheet" type="text/css" href="../css/a.css">
  <script type="text/javascript" src="../../jquery/jquery-3.5.1.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $("#navigation").load("shared_links.html"); 
        
      $('.map_iframe').css('height', $('#content').height()*0.8+'px');
      $('.map_iframe').css('width', $('#content').width()+'px');
    });
  </script>
</head>
<body>
  <span class="header"><img src="../css/images/oracle.png"> Maps API Demos</span>
  <hr class="oj-hr">
  
  <div id="container">
    <div id="navigation"></div>
    <div id="content" class="panel">
      <table>
        <tr>
          <td>
            <iframe src="../u/jdbc_states_labels.html" class="map_iframe" width="650" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" > </iframe>
          </td>
        </tr>
        <tr>
          <td>
            <div class="panel">
            <span class="oj-message-content">
              This demo shows a thematic map. On top of a background map from Oracle Maps Cloud Service World Map, 
              it has two JDBC vector layers, one for population density of each state, 
              the other, its total population. It has a map control, the vector layer control, 
              which allows you to turn a vector layer on/off.
              A custom color ramp is used to color-code the population density.
              For the total population layer, a circle with a text label is used, and  
              the circle size is determined by the state's total population.
              An InfoWindow shows a state's info upon a mouse click.           
            </span>                
           </div>
          </td>
        </tr>
     </table>   
    </div>    
    <div class="clear">      
    </div>    
  </div>
</body>
</html>
